<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <link rel="icon" href="/assets/D_A-icon-a0962448.png">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" />
    <script src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>DS&AL</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
    <style>
      @keyframes hidePreloader {
          0% {
              width: 100%;
              height: 100%;
          }

          100% {
              width: 0;
              height: 0;
          }
      }

      body>div.preloader {
          position: fixed;
          background: white;
          width: 100%;
          height: 100%;
          z-index: 1071;
          opacity: 0;
          transition: opacity .5s ease;
          overflow: hidden;
          pointer-events: none;
          display: flex;
          align-items: center;
          justify-content: center;
      }

      body:not(.loaded)>div.preloader {
          opacity: 1;
      }

      body:not(.loaded) {
          overflow: hidden;
      }

      body.loaded>div.preloader {
          animation: hidePreloader .5s linear .5s forwards;
      }
    </style>
    <script>
        window.addEventListener("load", function() {
            setTimeout(function() {
                document.querySelector('body').classList.add('loaded');
            }, 300);
        });
        var type=0;
        var index;
    </script>
    <script type="module" crossorigin src="/assets/index-218b880e.js"></script>
    <link rel="stylesheet" href="/assets/index-327c96e5.css">
  </head>
  <body>
    <!-- Preloader -->
    <div class="preloader">
        <div class="spinner-border text-primary" role="status">
            <span class="sr-only">Loading...</span>
        </div>
    </div>
    <div id="app">
    </div>

    <!-- 全局js -->
    
    <script src="/Algorithm.js"></script>
    <!-- 画出的物体控制 -->
    <script src="/main_js/Object_control/ObjectManager.js"></script>
    <!-- 动画控制 -->
    <script src="/main_js/Animation_manager/AnimationManager.js"></script>
    <script src="/main_js/Animation_manager/SingleAnimation.js"></script>
    <!-- 运动的物体控制 -->
    <script src="/main_js/Animated_obj/AnimatedObject.js"></script>
    <script src="/main_js/Object_control/StateBox.js"></script>
    <script src="/main_js/Animated_obj/AnimatedCircle.js"></script>
    <script src="/main_js/Animated_obj/AnimatedHighlightCircle.js"></script>
    <script src="/main_js/Animated_obj/AnimatedHighlightRectangle.js"></script>
    <script src="/main_js/Animated_obj/AnimatedLabel.js"></script>
    <script src="/main_js/Animated_obj/AnimatedLine.js"></script>
    <script src="/main_js/Animated_obj/AnimatedPointer.js"></script>
    <script src="/main_js/Animated_obj/AnimatedRectangle.js"></script>

    <!-- 顺序表 -->

    <!-- 外部引入js -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.min.js"></script>

  </body>
</html>
